<template>
    <div class="list">
        <tool-bar nav="" :title="'git' + ( $props.isLib ? '-lib' : '应用') + '仓库'">
            <el-button @click="add_click()">添加</el-button>
        </tool-bar>
        <my-list
            :show-header="false"
            ref="list"
            url="/dev/git-data/list"
            @param="preload"
            @loaded="procData"
            :page-size="10"
            :store="true"
            :query="$data.query"
            systemKeys="isLib"
        >

            <el-table-column align="left" label="仓库地址" min-width="240">
                <template v-slot="scope">
                    <div style="display: flex;position: relative;justify-content: space-between;">
                        <div class="link"
                             @click="edit_click(scope.row)">
                            {{ scope.row.name }}
                        </div>
                        <div style="color:gray;font-size:x-small;" v-if="scope.row.productLine">
                            <el-tag :type="scope.row.language =='Java' ? 'primary': 'warning'">

                                {{
                                    scope.row.productLine.name
                                }} |
                                {{ scope.row.language_res }}:{{ scope.row.languageVersion }}
                                |
                                {{
                                    scope.row.url.slice(scope.row.server.url.length)
                                }}

                            </el-tag>
                        </div>
                    </div>

                    <div style="margin-top:4px;">
                        <el-tag effect="dark" :type="scope.row.language =='Java' ? 'primary': 'warning'"
                                :style="{marginTop: '4px', fontWeight: (item.port||80) == 80 ? 'normal' :'bold' }"
                                v-for="(item,index) in scope.row.folders"
                                :key="index">{{
                                (item.port || 80) == 80 ? (item.name || item.cnname) : (":" + item.port + (item.name.startsWith("/") ? item.name : ("/" + item.name)))
                            }}
                        </el-tag>
                    </div>
                </template>
            </el-table-column>

            <el-table-column label="操作" align="center" width="160">
                <template v-slot="scope">
                    <el-button @click="deploy_click(scope.row)" size="small" round>
                        部署
                    </el-button>
                    <el-button type="warning" plain round @click="delete_click(scope.row)" size="small">
                        删除
                    </el-button>
                </template>
            </el-table-column>

            <template #query="scope">
                <kv label="GitServer">
                    <selector v-model="scope.query.gitServerId" url="/dev/git-server/list" fields="id,name"
                              :enumCount="1" clearable></selector>
                </kv>
                <kv label="产品线" v-if="!$props.isLib">
                    <product-line :key="scope.query.language" :language="scope.query.language" clearable
                                  v-model="scope.query.productLineCode" chk="*"
                                  @change="productLine_change"></product-line>
                </kv>

                <kv label="语言">
                    <selector v-model="scope.query.language" enum="JenkinsLanguageEnum" clearable></selector>
                </kv>
                <kv label="版本">
                    <el-input v-model="scope.query.languageVersion"></el-input>
                </kv>
                <kv label="仓库名称">
                    <el-input v-model="scope.query.name"></el-input>
                </kv>
                <kv label="应用名称">
                    <el-input v-model="scope.query.appName"></el-input>
                </kv>

                <kv label="选项" v-if="!$props.isLib">
                    <selector multi v-model="scope.query.options" :data="$data.queryOptions"></selector>
                </kv>
            </template>
        </my-list>
    </div>
</template>
<style scoped lang="scss">
::v-deep(.el-tag.vue) {
    color: darkslategrey;
}
</style>
<script setup>

import productLine from "../../../component/product-line.vue";

/**
 * Created by CodeGenerator at 2021-02-07 18:51:27
 */




//定义 vue2的this,当前组件
const $self = getCurrentInstance();

//定义 $attrs
const $attrs = useAttrs();

const $props = defineProps({
    isLib: {type: Boolean}
});


//定义data
const $data = reactive({
    query: {
        isLib: $props.isLib,
    },
    queryOptions: {
        'is80': '80端口',
        not80: '非80端口',
        defaultDockerfile: '默认Dockerfile',
        notDefaultDockerfile: '非默认Dockerfile',
        defaultYaml: '默认K8sYaml',
        notDefaultYaml: '非默认K8sYaml'
    },
    dlg_visible: false,
    cur_row: {},
    pageSize: 10,
    JenkinsLanguageEnum: jv.enum.JenkinsLanguageEnum.getData(),
    products: []
});


const list = ref();

//定义事件
const $emit = defineEmits(["update:modelValue", "loaded"]);


const productLine_change = function (v, m, p) {
// if (p.cause == "change") {
// 	this.sortWithLastProjectCodes(v)
// }
};
const preload = function (param) {
//添加查询参数，修改分页参数等。
//param.type = jv.$route.params.type
};
const procData = function (res) {
    res.data.data.forEach(it => {
//如果是组合实体，设置 it.id=...
        jv.enum.JenkinsLanguageEnum.fillRes(it, "language");
    });
};
const loadData = function (pageNumber) {
    list.value.loadData(pageNumber);
};
const add_click = function () {
    if ($props.isLib) {
        jv.$router.push("/dev/git-data/lib/add")
    } else {
        jv.$router.push("/dev/git-data/add")
    }
};
const edit_click = function (row) {
//记录上次点击行
    var rowId = row.id;
    list.value.setLastRow(row);
    jv.$router.push("/dev/git-data/edit/" + rowId)
};
const delete_click = function (row) {
    var rowId = row.id;
    var rowName = row.name;
    jv.confirm('确认删除 ' + rowName + ' 吗？').then(res => {
        jv.$http.post("/dev/git-data/delete/" + rowId).then(res => {
            loadData();
        })
    });
};
const deploy_click = function (row) {
    var rowId = row.id;
    list.value.setLastRow(row);
    jv.$router.push("/ops/deploy?productLineCode=" + row.productLine.code + "&gitId=" + rowId);
};
const dependency_click = function (row) {
    $data.dlg_visible = true;
    $data.cur_row = row;
};
const set_click = function (row) {
//设置事件
    var rowId = row.id;
};

onMounted(function () {
// this.db_products = [];
// jv.$http.post("/dev/product-line/list").then(res => {
// 	this.db_products = res.data.data;
//
//
// 	this.sortWithLastProjectCodes();
// })
})


watch(()=>$props.isLib,v=>{
  $data.query.isLib = v;
  nextTick(()=>{
    list.value.loadData(1);
  })
},{immediate:true})

</script>
